
<article class="module width_full">
    <header><h3>{#title#}</h3></header>
	<table width="100%" cellpadding="3" cellspacing="1">
		<tr>
		<td class="header" style="font-weight:bold;">{#total_earnings#}</td>
		<td class="header"><span style="float:right;background-color:#{if $total_earnings >= 1}9DD1A9{else}bd6a6a{/if}; font-weight:bold; color:#ffffff; text-align:right;">{$total_earnings} {#sign#}</span></td>
		</tr>
	</table>
		<div id="tablewrapper">
			<div id="tableheader">
				<div class="search">
					<select id="columns" onchange="sorter.search('query')">
			  <option value="-1">{#columns#}</option>
			  </select>
					<input type="text" id="query" onkeyup="sorter.search('query')" />
				</div>
			<span class="details">
			  <div>{#entries#} <span id="startrecord"></span>-<span id="endrecord"></span> {#from#} <span id="totalrecords"></span></div>
			  <div><a href="javascript:sorter.reset()">{#reset#}</a></div>
			</span>
		  </div>
		<table cellpadding="0" cellspacing="0" id="table" class="tinytable" style="width:100%;" >
			<thead>
				<tr>
					<th align="center" class="header"><h3>{#admin#}</h3></th>
					<th align="center" class="header"><h3>{#date#}</h3></th>
					<th align="center" class="header"><h3>{#coins#}</h3></th>
					<th align="center" class="header"><h3>{#to#}</h3></th>
					<th align="center" class="header"><h3>{#reason#}</h3></th>
					<th align="center" class="header"><h3>{#donation#}</h3></th>
					<th align="right" class="header"><h3>{#action#}</h3></th>
				</tr>
			</thead>
			<tbody>
		{if !empty($value)}
		{foreach from=$value item=item}							
			{literal}
			<script type="text/javascript">
				$(function() {
					$(".inv_button_{/literal}{$item.id}{literal}").click(function() {
						var id 					= '{/literal}{$item.id}{literal}';
						var dataString	= 'donate='+ id;
						var parent = $(this).parent();
					$.ajax({
						type: "POST",
						url: "_javascript/ajax_livedit.php",
						data: dataString,
						cache: false,
						success: function()
							{
								$("#maininv_{/literal}{$item.id}{literal}").fadeOut('slow', function() {$("#maininv_{/literal}{$item.id}{literal}").remove();});
							}
					});
					return false;
					});
				});
			</script>
			{/literal}
			<tr id="maininv_{$item.id}" style="background-color:{$item.color}">
				<td align="center" class="body"><a style="color:#000000; font-weight:bold;" href="index.php?mod=profile&userID={$item.admin}" target="_blank">{$item.adminname}</a></td>
				<td align="center" class="body">{$item.timestamp}</td>
				<td align="center" class="body">{$item.coins}</td>
				<td align="center" class="body"><a style="color:#000000; font-weight:bold;" href="index.php?mod=profile&userID={$item.userID}" target="_blank">{$item.username}</a></td>
				<td align="center" class="body">{$item.reason}</td>
				<td align="center" class="body">{$item.amount}{#sign#}</td>
				<td align="right" class="body"><a href="" class="inv_button_{$item.id}"><img src="_images/icons/cross.png" alt="" /></a></td>
			</tr>
		{/foreach}
		{else}
			<tr>
				<td class="body">{#nodonations#}</td>
				<td class="body"></td>
				<td class="body"></td>
				<td class="body"></td>
				<td class="body"></td>
				<td class="body"></td>
				<td class="body"></td>
			</tr>
		{/if}
		</tbody>
	 </table>
	   <div id="tablefooter">
		 <div id="tablenav">
		   <div>
			 <!--<img src="_images/icons/arrow_left.png" alt="First Page" onclick="sorter.move(-1,true)" />&laquo;-->
			 <img src="_images/icons/arrow_left.png" alt="First Page" onclick="sorter.move(-1)" />
			 <img src="_images/icons/arrow_right.png" alt="First Page" onclick="sorter.move(1)" />
			 <!--<img src="_images/icons/arrow_right.png" alt="Last Page" onclick="sorter.move(1,true)" />&raquo;-->
		   </div>
		   <div>
			 <select id="pagedropdown"></select>
		   </div>
		   <div class="page">
			 <a href="javascript:sorter.showall()">{#see_all#}</a>
		   </div>
		 </div>
		 <div id="tablelocation">
		   <div>
			 <select onchange="sorter.size(this.value)">
			   <option value="5">5</option>
			   <option value="10" selected="selected">10</option>
			   <option value="20">20</option>
			   <option value="50">50</option>
			   <option value="100">100</option>
			 </select>
			 <span>{#entries_p_site#}</span>
		   </div>
		   <div class="page">{#site#} <span id="currentpage"></span> {#from#} <span id="totalpages"></span></div>
			 </div>
		 </div>
	 </div>
	<footer style="overflow:hidden;">
		<div class="submit_link">
			<a href="index.php?mod=donate&page=add"><input type="submit" value="{#add_donation#}" class="alt_btn"></a>
		</div>
	</footer>
</article>
		{literal}
<script>



    var sorter = new TINY.table.sorter('sorter','table',{
      headclass:'head',
      ascclass:'asc',
      descclass:'desc',
      evenclass:'evenrow',
      oddclass:'oddrow',
      evenselclass:'evenselected',
      oddselclass:'oddselected',
      paginate:true,
      size:10,
      colddid:'columns',
      currentid:'currentpage',
      totalid:'totalpages',
      startingrecid:'startrecord',
      endingrecid:'endrecord',
      totalrecid:'totalrecords',
      hoverid:'selectedrow',
      pageddid:'pagedropdown',
      navid:'tablenav',
      sortcolumn:1,
      sortdir:1,
      init:true
    });
    </script>
    {/literal}